<template>
  <!--系统配置-->
  <div class='search'>
    <a-card :bordered='false'>
      <a-tabs @tabClick='handleTabClick' :defaultActiveKey='current' v-model='current' :animated='false'>
        <a-tab-pane tab='文件存储' key='form1'>
          <oss-form style='width: 80%' ref='form1'></oss-form>
        </a-tab-pane>
        <a-tab-pane tab='短信' key='form2'>
          <sms-form style='width: 80%' ref='form2'></sms-form>
        </a-tab-pane>
        <a-tab-pane tab='推送' key='form3'>
          <push-form style='width: 80%' ref='form3'></push-form>
        </a-tab-pane>
        <a-tab-pane tab='即时通讯' key='form4'>
          <im-form style='width: 80%' ref='form4'></im-form>
        </a-tab-pane>
        <a-tab-pane tab='公共配置' key='tab5'>
          <tab5 style='width: 80%' ref='tab5'></tab5>
        </a-tab-pane>
      </a-tabs>
      <div class='tab-footer'>
        <a-button type='primary' @click='handleSubmit' :loading='saving'>保存</a-button>
      </div>

    </a-card>

  </div>
</template>
<script>


import OssForm from "./tab1"
import SmsForm from "./tab2"
import PushForm from "./tab3"
import ImForm from "./tab4"
import ProdForm from "./tab100"
import Tab5 from "./tab5"

export default {
  name: "userModal",
  props: {},
  data() {
    return {
      saving: false,
      current: "form1",
      forms: [
        "form1",
        "form2",
        "form3",
        "form4",
        "form100"
      ]
    }
  },
  methods: {
    handleSubmit() {
      this.$refs[this.current].handleSubmit()
    },
    handleTabClick(name) {
      this.current = name
      this.$nextTick(() => {
        this.$refs[this.current].setData()
      })
    }
  },
  created() {
  },
  components: { Tab5, PushForm, SmsForm, OssForm, ImForm, ProdForm }
}
</script>

<style scoped lang='less' rel='stylesheet/less'>

</style>
